<template>
	<view :class="[BackGround]" :style="[{'font-weight':Style,'font-family':Font,height:100 + '%',minHeight:height + 'px'}]">
		<cu-custom bgColor="bg-gradual-blue" isBack="true">
			<view slot="backText">返回</view>
			<view slot="content">{{title}}</view>
		</cu-custom>
		<sear-ch :placeholder="placeholder" @clean="clean" @input="input" @remove="remove"></sear-ch>
		<!-- 修理位置 -->
		<view :class="['cu-list menu-avatar FirstList margin-xs radius shadow shadow-lg bg-white' ,BackGroundBox]" :style="{marginTop:110 + 'rpx'}" v-if="Page == 1">
			<block v-for="(item,index) in deliverplan" :key="index">
				<view class="cu-item" @tap="backTo(item)" v-if="item.isShow">
					<view class="cu-avatar radius lg" style="background-color:#fff">
						<image src="/static/images/Distributionsettings.png" mode="aspectFit"></image>
					</view>
					<view  class="content">
						<view class="text-pink">
							<view class="text-cut">{{item.LREPPOSITION}}</view>
						</view>
					</view>
				</view>
			</block>
		</view>
		<!-- 修理方式 -->
		<view :class="['cu-list menu-avatar FirstList margin-xs radius shadow shadow-lg bg-white' ,BackGroundBox]" :style="{marginTop:110 + 'rpx'}" v-else-if="Page == 2">
			<block v-for="(item,index) in deliverplan" :key="index">
				<view class="cu-item" @tap="backTo(item)" v-if="item.isShow">
					<view class="cu-avatar radius lg" style="background-color:#fff">
						<image src="/static/images/Distributionsettings.png" mode="aspectFit"></image>
					</view>
					<view  class="content">
						<view class="text-pink">
							<view class="text-cut">{{item.LREPTYPPE}}</view>
						</view>
					</view>
				</view>
			</block>
		</view>
		<!-- 修理要求 -->
		<view :class="['cu-list menu-avatar FirstList margin-xs radius shadow shadow-lg bg-white' ,BackGroundBox]" :style="{marginTop:110 + 'rpx'}" v-else-if="Page == 3">
			<block v-for="(item,index) in deliverplan" :key="index">
				<view class="cu-item" @tap="backTo(item)" v-if="item.isShow">
					<view class="cu-avatar radius lg" style="background-color:#fff">
						<image src="/static/images/Distributionsettings.png" mode="aspectFit"></image>
					</view>
					<view  class="content">
						<view class="text-pink">
							<view class="text-cut">{{item.LREPPRDTYPE}}</view>
						</view>
					</view>
				</view>
			</block>
		</view>
		<!-- 需要零件 -->
		<view :class="['cu-list menu-avatar FirstList margin-xs radius shadow shadow-lg bg-white' ,BackGroundBox]" :style="{marginTop:110 + 'rpx'}" v-else-if="Page == 4">
			<block v-for="(item,index) in deliverplan" :key="index">
				<view class="cu-item" @tap="backTo(item)" v-if="item.isShow">
					<view class="cu-avatar radius lg" style="background-color:#fff">
						<image src="/static/images/Distributionsettings.png" mode="aspectFit"></image>
					</view>
					<view  class="content">
						<view class="text-pink">
							<view class="text-cut">{{item.LREPPRDTYPE}}</view>
						</view>
					</view>
				</view>
			</block>
		</view>
		<!-- 油脂类型 -->
		<view :class="['cu-list menu-avatar FirstList margin-xs radius shadow shadow-lg bg-white' ,BackGroundBox]" :style="{marginTop:110 + 'rpx'}" v-else>
			<block v-for="(item,index) in deliverplan" :key="index">
				<view class="cu-item" @tap="backTo(item)" v-if="item.isShow">
					<view class="cu-avatar radius lg" style="background-color:#fff">
						<image src="/static/images/Distributionsettings.png" mode="aspectFit"></image>
					</view>
					<view  class="content">
						<view class="text-pink">
							<view class="text-cut">{{item.LREPPRDTYPE}}</view>
						</view>
					</view>
				</view>
			</block>
		</view>
	</view>
</template>

<script>
	import SearCh from '@/colorui/components/search.nvue'
	import ListForm from '@/colorui/components/ListForm/ListForm.vue'
	import {
		mapGetters,
		mapMutations
	} from 'vuex'
	export default {
		data() {
			return {
				height:this.screenHeight,
				title: '',
				Page:0,
				placeholder: '位置',
				deliverplan: [{
						LREPPOSITION: '主轴轴承',
						isShow: true,
					},
					{
						LREPPOSITION: '齿轮联轴器',
						isShow: true,
					}
				]
			}
		},
		computed: {
			...mapGetters(['Style','Font','BackGround','BackGroundBox'])
		},
		components: {
			SearCh,
			ListForm
		},
		onLoad(options) {
			this.title = options.name
			this.Page = options.Page
			if(options.name == '修理位置') { // 修理位置
				for (let i = 0; i < 4; i++) {
					this.deliverplan = this.deliverplan.concat(this.deliverplan)
				}
			} else if (options.name == '修理方式') { // 修理方式
				this.deliverplan = [{
						LREPTYPPE: '压力润滑',
						isShow: true,
					},
					{
						LREPTYPPE: '手抹',
						isShow: true,
					}
				]
				for (let i = 0; i < 4; i++) {
					this.deliverplan = this.deliverplan.concat(this.deliverplan)
				}
			} else if (options.name == '修理要求'){ // 修理要求
				this.deliverplan = [{
						LREPPRDTYPE: '锂基脂',
						isShow: true,
					},
					{
						LREPPRDTYPE: '120#工业齿轮油',
						isShow: true,
					}
				]
				for (let i = 0; i < 4; i++) {
					this.deliverplan = this.deliverplan.concat(this.deliverplan)
				}
			} else if (options.name == '需要零件'){ // 需要零件
				this.deliverplan = [{
						LREPPRDTYPE: '锂基脂',
						isShow: true,
					},
					{
						LREPPRDTYPE: '120#工业齿轮油',
						isShow: true,
					}
				]
				for (let i = 0; i < 4; i++) {
					this.deliverplan = this.deliverplan.concat(this.deliverplan)
				}
			}  else { // 油脂类型
				this.deliverplan = [{
						LREPPRDTYPE: '锂基脂',
						isShow: true,
					},
					{
						LREPPRDTYPE: '120#工业齿轮油',
						isShow: true,
					}
				]
				for (let i = 0; i < 4; i++) {
					this.deliverplan = this.deliverplan.concat(this.deliverplan)
				}
			}
		},
		methods: {
			...mapMutations(['modifysetitem']),
			backTo(item) {
				this.modifysetitem(item)
				// if(this.title == '润滑位置') {
				// 	this.periodsetitem1(item)
				// } else if(this.title == '润滑方式') {
				// 	this.periodsetitem2(item)
				// } else {
				// 	this.periodsetitem3(item)
				// }
				uni.navigateBack({
					delta: 1
				});
			}
		}
	}
</script>

<style>
	page {
		background-color: whitesmoke;
	}
</style>
